<div id="utterances"></div>
<noscript>Please enable JavaScript to view the <a href="https://github.com/utterance">comments powered by utterances.</a></noscript>
<script>
  document.addEventListener('DOMContentLoaded', function () {
    function checkTheme(local, base) {
      var currentTheme = local || base;

      if (currentTheme === "dark") {
        return "photon-dark";
      } else if (currentTheme === "hacker") {
        return "photon-dark";
      } else if (currentTheme === "kimbie") {
        return "github-dark-orange";
      } else {
        return "github-light";
      }
    }

    try {
      {{ $owner:= .Site.Params.utterances.owner }}
      var owner = JSON.parse({{ $owner | jsonify }});
      {{ $repo:= .Site.Params.utterances.repo }}
      var repo = JSON.parse({{ $repo | jsonify }});
      {{ $baseTheme:= index .Site.Params.themeOptions 0 }}
      var baseTheme = JSON.parse({{ $baseTheme | jsonify }});
      var localTheme = localStorage.getItem('theme');
      var utterTheme = checkTheme(localTheme, baseTheme);
      var myScript = document.createElement('script');
      myScript.setAttribute('src', 'https://utteranc.es/client.js');
      myScript.setAttribute('repo', `${owner}/${repo}`);
      myScript.setAttribute('issue-term', 'pathname');
      myScript.setAttribute('theme', utterTheme);
      myScript.setAttribute('crossorigin', 'anonymous');
      myScript.setAttribute('async', '');
      myScript.onload = function() {
      }

      

      document.getElementById('utterances').appendChild(myScript);
    } catch (err) {
      console.log(err);
    }
  });
</script>

<div id="comments-fallback" class="viaemail">
    <div class="utterances__message">
        {{ .Site.Params.utterances.message }}
        <a href="https://github.com/{{ .Site.Params.utterances.owner }}/{{ .Site.Params.utterances.repo }}/issues/{{ .Params.utterances_issue_id | default "" }}" target="_blank" rel="noreferrer">&nbsp;{{ .Site.Params.utterances.link }}</a>
    </div>
</div>
